import React, { useContext, useEffect, useRef } from 'react';

import { useAntdTable } from 'ahooks'
import { Form } from 'antd';
import { AntdTableOptions } from 'ahooks/lib/useAntdTable/types';
import { AppContext } from '../AppProvider';
import { parseDateFormat } from './parseDateFormat';
interface AntdListOptions extends AntdTableOptions<any, any> {
  tabsKey?: string
  defaultTabsActiveKey?: string
  formatAfterData?: (formData: any) => any
  formatResult?: (formData: any) => any
}
const getValue = (value, key) => {
  return value[key] || key
}
const useAntdList = (service: any, options: AntdListOptions) => {
  const { antdList = {} as any } = React.useContext(AppContext)
  const { tabsKey, formatResult, defaultTabsActiveKey, form, formatAfterData } = options || {}
  const [tabsActiveKey, setTabsActiveKey] = React.useState<string>(
    defaultTabsActiveKey || ""
  );
  const { page = {} } = antdList;
  const reqParams = useRef(null)
  const size = getValue(page, 'size')
  const current = getValue(page, 'current')
  const antdListResult = useAntdTable(async (params = {}) => {
    // let pageParams = { current: params.current, pageSize: params.pageSize, sorter: params.sorter, filters: params.filters }
    const pageParams = {
      ...params
    };
    let formData: any = {};
    if (form) {
      formData = { ...formData, ...form.getFieldsValue() }
    }
    if (tabsKey) {
      formData[tabsKey] = tabsActiveKey;
    }
    if(pageParams.pageSize){

      pageParams[size] = pageParams.pageSize
      delete pageParams.pageSize
    }
    if(pageParams.current){
      pageParams[current] = pageParams.current
      // delete pageParams[current]

    }
    
    if (page.key) {
      formData[page.key] = pageParams
    } else {
      formData = { ...formData, ...pageParams }
    }
    formData = parseDateFormat(formData)
    if (formatAfterData) {
      formData = formatAfterData(formData);
    }

    reqParams.current = formData;

    const data = await service(formData);
    if (formatResult) {
      return formatResult(data) as any;
    }

    let total = 0,
      list = [];
    const totalKey = getValue(page, 'total')
    const recordsKey = getValue(page, 'records')
    // let totalKey = 'total', recordsKey = 'records';
    // if (antdList) {
    //   if (antdList.totalKey) {
    //     totalKey = antdList.totalKey
    //   }
    //   if (antdList.recordsKey) {
    //     recordsKey = antdList.recordsKey
    //   }
    // }

    if (data) {
      if (Array.isArray(data)) {
        total = data.length
        list = data
      }
      else {
        total = data[totalKey] || 0;
        list = data[recordsKey] || [];
      }

    }
    // @TODU  支持全局处理
    return {
      total,
      list,
    };
  }, options);

  const onTabsChange = (e) => {
    setTabsActiveKey(e);
    antdListResult.search.submit();
  };
  antdListResult.tableProps.pagination.showQuickJumper =
    antdList.showQuickJumper === undefined
      ? true
      : antdList.showQuickJumper;
  antdListResult.tableProps.pagination.showSizeChanger =
    antdList.showSizeChanger === undefined
      ? true
      : antdList.showSizeChanger;
  antdListResult.tableProps.pagination.showTotal = total => `共 ${total} 条`;
  return {
    ...antdListResult,
    tabsProps: {
      onChange: onTabsChange,
      activeKey: tabsActiveKey,
    },
    search: {
      reset: antdListResult.search.reset,
      submit: antdListResult.search.submit,
      // form,
    },
    reqParams: reqParams.current,
    form
  }
}
export default useAntdList